<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>CKEditor</title>
	<style type="text/css">
		@import "";
		.pos{
			position:absolute;
			left:300px;
			display:none;
		}
	</style>
	<script src="js/jquery-1.7.1.min.js"></script>
	<script src="js/jquery.blockUI.js"></script>
	<script type="text/javascript" src="ckeditor/ckeditor.js"></script> 
	<script type="text/javascript" src="ckeditor/adapters/jquery.js"></script>
	<script>
		function initial_editor(){
			config = {
				language : "zh", //語系
				toolbar : "Normal", //toolbar模式
				width: "550px",
				resize_enabled: false,
				removePlugins: 'elementspath',
				enterMode: CKEDITOR.ENTER_BR
			};
			$("#editorS").ckeditor(config);
		}
		
		function test(){
			$.blockUI({ 
				message: $("#container"),
				css: {
					width: '580px' ,
					height: "300px",					
					left: ($(window).width() - 580) /2 + 'px', 
					top: ($(window).height() - 300) /2 + 'px',
				},
				onBlock:function(){
					initial_editor();
				}
			}); 
			$('.blockOverlay').click(function(){
				$("#editorS").html($("#editorS").ckeditorGet().getData());
				$("#editorS").ckeditorGet().destroy(); 
				$.unblockUI();
			}); 
		}
		
		function mod(){
			$("#editorS").html($("#editorS").ckeditorGet().getData());
			$("#editorS").ckeditorGet().destroy(); 
		}
	</script>
</head>

<body>
	<div id="container" style="display:none" align="center">
		<div id="editorS"></div>
	</div>
	<input type="button" onclick="test()" value="Open">
</body>
</html>